<template>
  <a-form-model layout="inline" :model="formSearch" @submit="handleSubmit" @submit.native.prevent>
    <a-form-model-item label="搜索关键字">
      <a-input v-model="formSearch.searchWord" placeholder="请输入关键词">
        <a-icon slot="prefix" type="user" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item>
    <a-form-model-item label="商品类目">
        <a-select
        v-model="formSearch.category"
        placeholder="请选择类目"
        style="width: 200px"
        allowClear
        @change="changeHandle">
        <a-select-option v-for="item in categoryList" :key='item.id' :value="item.id" >
          {{ item.name }}
        </a-select-option>

      </a-select>
    </a-form-model-item>
    <a-form-model-item>
      <a-button type="primary" html-type="submit" @click="handleSubmit">
        搜索
      </a-button>
    </a-form-model-item>
  </a-form-model>
</template>
<script>
// eslint-disable-next-line import/extensions

export default {
  props: ['categoryList'],
  data() {
    return {
      formSearch: {
        category: '',
        searchWord: '',
      },
    };
  },

  methods: {
    handleSubmit() {
      this.$emit('searchSubmit', this.formSearch);
    },
    changeHandle() {
    },
  },
};
</script>
